<template>
	<view class="diet" :style="{paddingTop: paddingHeight + 'px'}">
		<nav-bar></nav-bar>
		<view class="t-h-container">
			<view class="t-h-title">
				请选择
			</view>
			<view class="t-h-sub-title">
				您正在记录的就餐时段
			</view>
			<view class="category_l">
				<view class="i_c" v-for="(item,index) in options" :key="index" @click="selectType(index)">
					<text>{{ item.text }}</text>
					<text class="iconfont icon-yuanhuan1" v-if="item.select"></text>
					<text class="iconfont icon-yuanhuan" v-else></text>
				</view>
			</view>
		</view>
		<view class="large_button" @click="goNext">
			下一步
		</view>
	</view>
</template>

<script>
	const dayjs = require('@/utils/dayjs.min.js');
	export default {
		data() {
			return {
				paddingHeight: uni.getStorageSync('navbarHeight'),
				userId: uni.getStorageSync("userId"),
				tag: undefined,
				type: 'measure', // 操作状态
				options: [{
					text: '早餐',
					type: 1,
					select: true
				}, {
					text: '中餐',
					type: 2,
					select: false
				}, {
					text: '晚餐',
					type: 3,
					select: false
				}, {
					text: '加餐',
					type: 7,
					select: false
				}, ],
				currentType: 1
			}
		},
		onLoad(OPTIONS) {
			this.type = OPTIONS.type
			this.tag = OPTIONS.tag
		},
		methods: {
			// 判断跳转连接
			goNext() {
				if (this.type == 'add') {
					let day = dayjs().format('YYYY/MM/DD')
					uni.redirectTo({
						url: `/pagesA/health/device/info/diet/time?day=${day}&meal=${this.currentType}`
					})
				} else {
                    uni.redirectTo({
                        url: `/pagesA/health/device/connect/index?tag=${this.tag}&meal=${this.currentType}`
                    })
					// if (this.tag == 4) { // 餐前
					// 	uni.redirectTo({
					// 		url: `/pagesA/health/device/connect/index?tag=${this.tag}&meal=${this.currentType}`
					// 	})
					// } else {
					// 	uni.redirectTo({
					// 		url: `/pagesA/health/device/info/diet/before?tag=${this.tag}&meal=${this.currentType}`
					// 	})
					// }
				}
			},
			selectType(INDEX) {
				this.options.forEach((item, index) => {
					if (INDEX == index) {
						item.select = true
						this.currentType = item.type
					} else {
						item.select = false
					}
				})
			}
		}
	}
</script>


<style lang="scss">
	page {
		background-color: #FAFAFA;
		min-height: 100%;
	}
</style>
<style lang="scss" scoped>
	.diet {
		.category_l {
			margin-top: 48rpx;
			padding: 0 32rpx;

			.i_c {
				width: 100%;
				height: 140rpx;
				background: #FFFFFF;
				border-radius: 32rpx;
				padding: 0 48rpx;
				display: flex;
				align-items: center;
				justify-content: space-between;
				margin-bottom: 16rpx;
				font-weight: 500;
				font-size: 32rpx;
				color: #333333;
				font-family: PingFangSC-Medium, PingFang SC;

				.iconfont {
					font-size: 36rpx;
					color: #b4b4b4;
				}

				.icon-yuanhuan1 {
					color: #545dde;
				}
			}
		}

		.large_button {
			position: fixed;
			bottom: 76rpx;
			left: 50%;
			transform: translateX(-50%);
		}
	}
</style>